.cq-menu--default_comp {
	font-size: 0;
	.cq-menu {
		padding: 20px 10px;
	}
	.pc {
		@include media-breakpoint-down(md) {
			display: none;
		}
		box-shadow: 0 0 4px 3px rgba(0, 0, 0, 0.1);
		.title-box {
			padding: 20px 30px;
			background-color: var(--theme-color);

			span {
				font-size: var(--font-size-h4);
				color: #fff;
			}
		}
	}
	.mobile {
		@include media-breakpoint-up(md) {
			display: none;
		}
		.cq-popup {
			--width-popup: 100%;
			--height-popup: 100%;
			.cq-popup--content {
				text-align: right;
				#menu-btn--mobile_close {
					position: relative;
					margin-top: 15px;
					margin-right: 10px;
					.cq-btn--line {
						position: absolute;
						top: 50%;
						left: 50%;
						z-index: 2;
						display: block;
						width: 60%;
						height: 2px;
						background-color: transparent;
						transform: translate(-50%, -50%);

						&::before {
							position: absolute;
							left: 0;
							top: 0px;
							content: '';
							display: block;
							width: 100%;
							height: 2px;
							transition: transform 0.4s ease-out 0s;
							transform: rotate(45deg);
							background-color: var(--color-icon);
						}

						&::after {
							position: absolute;
							top: 0px;
							left: 0px;
							content: '';
							display: block;
							width: 100%;
							height: 2px;
							transition: transform 0.4s ease-out 0s;
							transform: rotate(-45deg);
							background-color: var(--color-icon);
						}
					}
				}
			}
		}
	}
}
